<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">

    <style type="text/css">
        .triangle{
            width:0px;
            height:0px;
            border-right:6px solid transparent;
            border-left:6px solid transparent;
            border-bottom:6px solid #0984e3;

        }

        .line{
            border-bottom:2px solid #0984e3;
        }

        table{
            border-collapse:separate;
            border-spacing:0px 30px;
        }

        td{
            padding-top: 50px;
        }

    </style>

</head>
<body>

    <div style="width: 93%;margin-left: 30px;padding-bottom: 20px">
        <div class="row">
            <div style="width: 100%; height: 380px; padding-left:20px;padding-top: 10px;border: 1px solid #dcdde1">
                <span style="font-size: 25px; color: #0984e3 ">我的安全中心 </span>
                <div class="triangle" style="margin-left: 20px"></div>
                <div class="line"></div>

                <table class="table">
                    <tr>
                        <td>您的携程钱包安全级别:</td>
                        <td>
                            <span style="color: red;float: left">警告&nbsp;</span>
                            <div>
                                <div style="width: 50px;height: 20px;background-color: red; float: left"></div>
                                <div style="width: 260px;height: 20px;background-color: #dcdde1; float: left"></div>
                            </div>
                        </td>
                        <td>
                            <a href="#">
                                <span style="font-size: 13px">提升安全等级</span>
                            </a>
                        </td>
                    </tr>
                    <tbody>
                    <tr>
                        <td>
                            <span class="glyphicon glyphicon-exclamation-sign" style="color: #ffa502; font-size: 15px"></span>
                            <span style="color: #747d8c; font-size: 15px">未设</span>
                            &emsp;&emsp;
                            <span style="font-size: 16px">支付密码</span>
                        </td>
                        <td>
                            <span style="color: #747d8c; font-size: 13px">现金余额/礼品卡付款或修改钱包账户信息时输入，保护账户资金安全</span>
                        </td>
                        <td>
                            <a href="#">
                                <span style="font-size: 13px">设置</span>
                            </a>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <span class="glyphicon glyphicon-exclamation-sign" style="color: #ffa502; font-size: 15px"></span>
                            <span style="color: #747d8c; font-size: 15px">未设</span>
                            &emsp;&emsp;
                            <span style="font-size: 16px">安全验证邮箱</span>
                        </td>
                        <td>
                            <span style="color: #747d8c; font-size: 13px">验证后，港澳台和海外用户可用于接收账户安全验证码。</span>
                        </td>
                        <td>
                            <a href="#">
                                <span style="font-size: 13px">绑定</span>
                            </a>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <span class="glyphicon glyphicon-exclamation-sign" style="color: #ffa502; font-size: 15px"></span>
                            <span style="color: #747d8c; font-size: 15px">未设</span>
                            &emsp;&emsp;
                            <span style="font-size: 16px">安全验证手机</span>
                        </td>
                        <td>
                            <span style="color: #747d8c; font-size: 13px">	验证后，可用于接收账户安全验证码。</span>
                        </td>
                        <td>
                            <a href="#">
                                <span style="font-size: 13px">绑定</span>
                            </a>
                        </td>
                    </tr>
                    </tbody>
                </table>

            </div>
        </div>
    </div>

</body>
</html>